<template>
  <div class="body">
    <section class="Downloads">
      <div class="info">
        <div class="center-block">
          <div class="Crumbs">
            您的位置：
            <router-link to="/home">首页<b>&gt;</b></router-link>
            <router-link to="/information/approval">信息公开<b>&gt;</b></router-link>
            <a href="javascript:;">地市主页</a>
          </div>
          <h3 class="title">{{dataInfo.departName}}</h3>
          <p class="adr">办事地址：{{dataInfo.departAddress}}</p>
          <p class="phone">服务热线：{{dataInfo.departPhone}}</p>
        </div>
      </div>
      <div class="module">
        <div class="center-block">
          <div id="QuaT1" class="notice_title QuaT clearfix">
            <h3 class="circular-title"></h3>
            <div id="QuaTle1" class="QuaTle Q_left">
              <span class="active">工程项目建设</span>
              <span>其他事项类型</span>
            </div>
          </div>
          <div id="QuaBoy1" class="QuaBoy">
            <section class="active">
              <div class="N_container">
                <div class="N_C_content clearfix">
                  <div class="C_menu">
                    <!--菜单栏-->
                    <el-menu unique-opened :default-active="query.subNo">
                      <!-- 一级菜单 -->
                      <el-submenu :index="item.subNo+''" v-for="(item,index) in tabs" :key="index">
                        <!-- 一级菜单的模板区域 -->
                        <template slot="title">
                          <!-- 文本 -->
                          <span>{{item.menuName}}</span>
                        </template>
                        <!-- 二级菜单 -->
                        <el-menu-item @click="showTab(index,order)" :data="itemSub.subNo" :index="itemSub.subNo+''"
                                      v-for="(itemSub,order) in item.subMune" :key="order">
                          <template slot="title">
                            <!-- 文本 -->
                            <span>{{itemSub.subMenuName}}</span>
                          </template>
                        </el-menu-item>
                      </el-submenu>
                    </el-menu>
                  </div>
                  <div class="C_content">

                    <div class="search" style="padding-bottom: 15px;">
                      <div class="input-group">
                        <input type="text" placeholder="请输入关键字" class="form-control inputSearch">
                        <span class="input-group-btn">
                          <button class="btn btn-default dtFont dtFont-sousuo btnSearch" type="button"></button>
                        </span>
                      </div>
                    </div>


                    <!--内容区域-->
                    <el-table :data="tableData.list" style="width: 100%" class="detail-table">
                      <el-table-column type="index" label="序号" width="60"></el-table-column>
                      <el-table-column prop="" label="申请主体" width="300">
                        <template slot-scope="scope">
                          <p class="applyMain">{{scope.row.applyMain}} <span>办件编号：{{scope.row.bJNo}}</span></p>
                        </template>
                      </el-table-column>
                      <el-table-column prop="applyItem" label="申请事项" width="220"></el-table-column>
                      <el-table-column prop="applyStartTime" label="申请时间" width="110"></el-table-column>
                      <el-table-column prop="applyEndTime" label="办结时间" width="110"></el-table-column>
                      <el-table-column prop="" label="审批意见">
                        <template slot-scope="scope">
                          <span v-if="scope.row.approveIdea>0">同意</span>
                          <span v-else class="noAgree">不同意</span>
                        </template>
                      </el-table-column>
                    </el-table>

                    <div class="padding-top-20">
                      <el-pagination
                        background
                        @size-change="handleSizeChange"
                        @current-change="handleCurrentChange"
                        :current-page="tableData.page"
                        :page-sizes="[10, 20, 50, 100]"
                        :page-size="query.pg"
                        layout="total, sizes, prev, pager, next, jumper"
                        :total="query.pgsz">
                      </el-pagination>
                    </div>

                  </div>
                </div>
              </div>
            </section>
            <section>
              <div class="N_container">暂无</div>
            </section>
          </div>
        </div>
      </div>
    </section>


  </div>
</template>

<script>
  import{getInfo } from '@/api/information/index.js'
  export default {
    name: "detail",
    data() {
      return {
        tabs:[],
        tableData:{
          list:[],
          total:0 //总条目数
        },
        query:{
          pg:1,//当前页数
          pgsz:10,//当前显示多少条
          value:'',
          subNo:'',
        },
        dataInfo:{
          departName:'南昌市住房和城乡建设局',
          departAddress:'南昌市东湖区北京西路2300号',
          departPhone:'0971-68888888'

        }
      }
    },
    mounted(){
      this.getInfo();
    },
    methods:{
      search() {
        this.getInfo();
      },
      handleSizeChange(val) {
        this.query.pgsz = val;
        this.getInfo();
      },
      handleCurrentChange(val) {
        this.query.pg = val;
        this.getInfo();
      },
      getInfo(data) {
        let {pg, pgsz,subNo, value} = this.query;
        data = {pg, pgsz,subNo, value};
        getInfo(data).then(res => {
          this.tabs = res.obj;
          let tabs = this.tabs;
          this.query.subNo = this.$route.query.subNo || '240100';
          tabs.map((v, i) => {
            v.subMune.map((e, j) => {
              if (e.subNo == this.query.subNo) {
                //console.log(i,j);
                this.tableData.list = res.obj[i].subMune[j].rows;
                this.tableData.total = res.obj[i].subMune[j].total;
              }
            })
          })
        })
      },
      showTab(index, order) {
        let {pg, pgsz,subNo, value} = this.query;
        let data = {pg, pgsz,subNo, value};
        getInfo(data).then(res => {
          this.tableData.list = res.obj[index].subMune[order].rows;
          this.tableData.total = res.obj[index].subMune[order].total;
        })
      }
    }
  }
</script>

<style scoped>
  @import '../../assets/css/information.css';
</style>
